<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>WelCome to HuNan University JudgeOnline</title>
    <link rel="stylesheet" href="../style/nav.css" >
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="../css/bootstrap.min.css">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" href="../css/bootstrap-theme.min.css">
    <!-- codemirror格式文件 -->
    <link rel="stylesheet" href="../plugs/codemirror/lib/codemirror.css" />
    <link rel="stylesheet" href="../plugs/codemirror/theme/seti.css" />
    <link rel="stylesheet" href="../plugs/codemirror/addon/fold/foldgutter.css" />

    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="../js/jquery-3.3.1.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="../js/bootstrap.min.js"></script>
    <!-- codemirror js文件 -->
    <script src="../plugs/codemirror/lib/codemirror.js"></script>
    <script src="../plugs/codemirror/mode/clike/clike.js"></script>
    <script src="../plugs/codemirror/addon/edit/matchbrackets.js"></script>
    <script src="../plugs/codemirror/addon/edit/closebrackets.js"></script>
    <!-- 代码折叠 -->
    <script src="../plugs/codemirror/addon/fold/foldcode.js"></script>
    <script src="../plugs/codemirror/addon/fold/foldgutter.js"></script>
    <script src="../plugs/codemirror/addon/fold/brace-fold.js"></script>
    <!-- 自己的js文件 -->
    <script src="js/controller.js"></script>
    <script src="js/myajax.js"></script>
</head>
<body>
    <div class="container">
        <!-- page head -->
        <div class="head-logo">
            <img alt="hnulogo" src="../img/hnulogo.gif">
            <h2>Welcome To Hunan University Judge Online</h2>
            <img alt="acmlogo" src="../img/acm.png" class="img-circle icpc" />
        </div>
        <div class="masthead">
            <ul class="nav nav-pills">
                <li id="home"><a href="../index">Home</a></li>
                <li id="problem"><a href="problem">Problem</a></li>
                <li id="status"><a href="status">Status</a></li>
                <li id="rank"><a href="rank">Rank List</a></li>
                <li id="discuss"><a href="discuss">Discuss</a></li>
                <li id="printer"><a href="printer">Printer</a></li>
                <li class="pull-right" id="info">
                    <button type="button" class="btn btn-primary" onclick="window.location='login'">Login</button>
                </li>
            </ul>
        </div>

        <!-- Site content-->
        <div class="row">
            <div class="col-md-12 column margin-top-2">
                <div class="card">
                    <div>
                        <table style="border-collapse:separate; border-spacing:1em 1em;">
                            <tr>
                                <td style="width: 10em"><strong>Problem Id:</strong></td>
                                <td><span id="problemId" class="wa"></span></td>
                            </tr>
                            <tr class="margin-top-2">
                                <td><strong>Language:</strong></td>
                                <td>
                                    <select id="language" class="form-control">
                                        <option value="1">gcc</option>
                                        <option value="2">g++</option>
                                        <option value="3">java</option>
                                        <option value="4">pascal</option>
                                        <option value="5">python</option>
                                    </select>
                                </td>
                                <td>
                                    <button id="submit" type="button" class="btn btn-primary margin-left-2">Submit</button>
                                </td>
                            </tr>
                        </table>
                    </div>
                    <div style="height: 50em; margin-bottom: 2em;">
                        <textarea id="myTextarea"></textarea>
                    </div>
                </div>
            </div>
        </div>
  
        <!-- Site footer -->
        <footer class="footer">
            <p>&copy; HNU ACM Team | <a href="#">Contact Us</a> | Version 2018</p>
            <p>Developer：balabala</p>
        </footer>
  
    </div>
</body>
<script>
    var problemId = getUrlVar("problemId");
    var contestId = getUrlVar("contestId");
    document.getElementById("problemId").textContent = base26Sytem(problemId);
    $("#problem").addClass("active");
    var editor = CodeMirror.fromTextArea(document.getElementById("myTextarea"), {
        lineNumbers:true,
        mode: "text/x-c++src",
        theme: "seti",
        indentUnit: 4,
        indentWithTabs: true,
        matchBrackets: true,
        autoCloseBrackets: true, 
        foldGutter: true,              // 允许在行号位置折叠
        gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
    });
    var selLang=document.getElementById("language");
    selLang.onchange=function() {
        var lang=selLang.value;
        switch (String(lang)) {
            case "1" :
                editor.setOption("mode", "text/x-csrc");
                break;
            case "2" :
                editor.setOption("mode", "text/x-c++src");
                break;
            case "3":
                editor.setOption("mode", "text/x-java");
                break;
            case "4":
                editor.setOption("mode", "text/x-pascal");
                break;
            case "5":
                editor.setOption("mode", "text/x-python");
                break;
            default:
                alert("Error!");
        }
    }
    $("#submit").click(function() {
        var data = new Object();
        data.lang = String(document.getElementById("language").value);
        data.code = editor.getValue();
        data.problemId = String(problemId);
        data.contestId = String(contestId);
        data.isContest = "1";
        submitCode(data);
    })
</script>
<script src="js/afterload.js"></script>
</html>